﻿﻿﻿﻿﻿﻿﻿﻿﻿﻿﻿﻿﻿<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta id="i18n_pagename" content="index">
    <meta charset="utf-8" />
    <title>鑫大簇</title>
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta content="Themesdesign" name="author" />
    <link rel="shortcut icon" href="images/favicon.ico" />
    <link href="css/magnific-popup.css" rel="stylesheet" type="text/css" />
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link
      href="css/materialdesignicons.min.css"
      rel="stylesheet"
      type="text/css"
    />
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="css/slick-theme.css" />
    <link rel="stylesheet" href="css/slick.css" />
	<link href="css/loading.css" rel="stylesheet"> -->
	
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	    <meta content="Themesdesign" name="author" />
	    <!-- favicon -->
	    <!-- <link rel="shortcut icon" href="images/favicon.ico" /> -->
	    <!-- Magnific -->
	    <link href="css/magnific-popup.css" rel="stylesheet" type="text/css" />
	    <!-- 关键CSS内联 -->
	    <style>
	      /* 最小化关键CSS - 保持首屏基本样式 */
	      body { 
	        visibility: hidden; 
	        opacity: 0; 
	        transition: opacity 0.3s ease;
	        font-family: sans-serif;
	      }
	      .navbar, .banner, .main-content { 
	        visibility: visible; 
	        opacity: 1; 
	      }
	      /* 基础布局样式 */
	      .container {
	        width: 100%;
	        max-width: 1200px;
	        margin: 0 auto;
	        padding: 0 15px;
	      }
	    </style>
		
		<!-- 预加载主要CSS -->
		<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" media="print" onload="this.media='all'" />
		<link href="css/materialdesignicons.min.css" rel="stylesheet" type="text/css" media="print" onload="this.media='all'" />
		<link href="css/style.css" rel="stylesheet" type="text/css" media="print" onload="this.media='all'" />
		
		<!-- 加载完成后显示页面 -->
		<script>
		  window.addEventListener('load', function() {
			setTimeout(function() {
			  document.body.style.visibility = 'visible';
			  document.body.style.opacity = '1';
			}, 100);
		  });
		</script>
		
		<!-- Slider -->
		<link rel="stylesheet" href="css/slick-theme.css" />
		<link rel="stylesheet" href="css/slick.css" />
	
  </head>

  <body>
    <!-- 导航栏开始 -->
    <nav class="navbar navbar-expand-lg fixed-top navbar-custom navbar-light sticky" >
      <div class="container">
        <!-- <div class="translate_selectLanguage_tag">切换语言</div> -->
        <a class="navbar-brand" href="#">
			<img src="images/image/logo.png" alt="LOGO" width="96">
		</a>
        <button
          class="navbar-toggler"
          type="button"
          data-toggle="collapse"
          data-target="#navbarCollapse"
          aria-controls="navbarCollapse"
          aria-expanded="false"
          aria-label="切换导航"
        >
          <span class="mdi mdi-menu"></span></button >

        <div class="collapse navbar-collapse" id="navbarCollapse">
          <ul class="navbar-nav">
            <li class="nav-item active">
              <a class="nav-link"  href="#home">首页</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="./pageProduct/index.html" id="product">产品</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="./pageNews/index.html" >新闻</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="./pageWhyBuyus/index.html">为什么选择我们</a>
            </li>
            <!-- <li class="nav-item">
              <a class="nav-link" href="./pageService/index.html">服务</a>
            </li> -->
            <li class="nav-item">
              <a class="nav-link" href="./pageContact/index.html">联系我们</a>
            </li>
			<li class="nav-item" style="margin-left: 425px;" >
			  <a class="nav-link" href="" id="language">
				  CN
				<img src="assets/CodeBubbyAssets/37_124/1.svg" alt="下拉箭头" width="16">
			  </a>
			</li>
          </ul>
        </div>
      </div>
    </nav>
	<!-- <div class="pullDown" id="pulldown" style="height: 0px;"></div> -->
    <!--end navbar-->

    <!-- 英雄区域开始 -->
     <!-- style="background-image: url('images/home/01.jpg')" -->
    <section class="bg-home" id="home">
		<div class="bg-overlay"></div>
		  <!-- <video src="images/video/bg.MP4" autoplay="autoplay"  width="100%" height="100%" style="position: absolute;z-index: -1;"></video> -->
		<img src="images/home/01.png"  width="100%" height="100%" alt="" srcset="" style="position: absolute;z-index: -1;">
		  <div class="home-center">
			<div class="home-desc-center">
			  <div class="container">
				<div class="row justify-content-center">
				  <div class="col-lg-8">
					<div class="title-heading text-center mt-5 pt-4">
					  <h1 class="heading text-white mb-3">这里是Xin Da Cu</h1>
					  <!-- 致力于数控车床、加工中心、数控铣床、普通车床的研发制造，提供定制服务； -->
					  <p class="para-desc mx-auto text-light">
						17年专注，百家企业客户见证，卓润数控提供优质的产品和专业的服务。为您量身定制专属机床，打造您满意，放心的机床解决方案
					  </p>
					</div>
				  </div>
				  <!--end col-->
				</div>
				<!--end row-->
			  </div>
			  <!--end container-->
			</div>
        <!--end home desc center-->
      </div>
      <!--end home center-->
    </section>
    <!--end section-->
    <!-- 英雄区域结束 -->
	
	<!-- 产品 -->
	<section class="product-center">
	        <div class="container">
	            <div class="section-header">
	                <h1 class="section-title">产品中心</h1>
	                <p class="section-description">优异的长期稳定性，灵活多样，易定制，提供技术支持和解决方案。</p>
	            </div>
	
	            <!-- 产品选项卡 -->
	            <div class="product-tabs" id="product-tab" >
	                <!-- <div class="product-tab active" data-tab="bending">数控折弯机</div>
	                <div class="product-tab" data-tab="cutting">激光切割机</div>
	                <div class="product-tab" data-tab="tube">激光切管机</div>
	                <div class="product-tab" data-tab="welding">激光焊接机</div>
	                <div class="product-tab" data-tab="combo">板管一体机</div> -->
	                <div class="tab-indicator" style="width: 178px; left: 398px;"></div>
	            </div>
	            <div class="tab-divider"></div>
	
	            <!-- 产品展示网格 -->
	            <div class="product-grid">
	                <!-- 主产品展示 -->
	                <div class="main-product">
	                    <img src="assets/CodeBubbyAssets/23_494/1.png" alt="数控折弯机" class="main-product-image">
	                    <div class="main-product-overlay">
	                        <div>
	                            <h2 class="main-product-title">数控折弯机</h2>
	                            <p class="main-product-description">
	                                支持多种折弯模式<br>
	                                降噪明显 操作快捷 速度翻倍
	                            </p>
	                        </div>
	                        <a href="./pageProduct/index.html" class="learn-more">
	                            了解更多
	                            <img src="assets/CodeBubbyAssets/23_494/2.svg" alt="箭头" width="16" height="16">
	                        </a>
	                    </div>
	                </div>
	
	                <!-- 产品卡片网格 -->
	                <div class="product-cards" id="product-cards">
	                    <!-- 产品卡片 1 -->
	                    <div class="product-card">
	                        <div class="product-card-bg"></div>
	                        <img src="assets/CodeBubbyAssets/23_494/3.png" alt="电液伺服折弯机" class="product-card-image">
	                        <h3 class="product-card-title">电液伺服折弯机</h3>
	                        <div class="product-card-divider"></div>
	                    </div>
	
	                    <!-- 产品卡片 2 -->
	                    <div class="product-card">
	                        <div class="product-card-bg"></div>
	                        <img src="assets/CodeBubbyAssets/23_494/3.png" alt="电液伺服折弯机" class="product-card-image">
	                        <h3 class="product-card-title">电液伺服折弯机</h3>
	                        <div class="product-card-divider"></div>
	                    </div>
	
	                    <!-- 产品卡片 3 -->
	                    <div class="product-card">
	                        <div class="product-card-bg"></div>
	                        <img src="assets/CodeBubbyAssets/23_494/3.png" alt="电液伺服折弯机" class="product-card-image">
	                        <h3 class="product-card-title">电液伺服折弯机</h3>
	                        <div class="product-card-divider"></div>
	                    </div>
	
	                    <!-- 产品卡片 4 -->
	                    <div class="product-card">
	                        <div class="product-card-bg"></div>
	                        <img src="assets/CodeBubbyAssets/23_494/3.png" alt="电液伺服折弯机" class="product-card-image">
	                        <h3 class="product-card-title">电液伺服折弯机</h3>
	                        <div class="product-card-divider"></div>
	                    </div>
	                </div>
	            </div>
	        </div>
	    </section>

    <!-- 客户 -->
    <section class="section">
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-12 text-center">
            <div class="section-title">
              <h4 class="title text-uppercase mb-4">我们的客户</h4>
              <p class="section-description">
                极致、高效的产品与服务体验，赢得客户口碑与信赖
              </p>
            </div>
          </div>
        </div>

        <div class="row mt-4" >
          <div class="customCard">
            <div class="customCard-row">
              <a href="#" class="customIcon">
                <img src="images/customer/domAin.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="#" class="customIcon">
                <img src="images/customer/和乐门业.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="#" class="customIcon">
                <img src="images/customer/满堂红.jpeg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/长城电器.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/中国电建.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
            </div>
            <div class="customCard-row" style="margin-top: 20px;">
              <a href="" class="customIcon">
                <img src="images/customer/中国东方航空.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/中国石油.jpeg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/中核集团.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/中煤.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/中国中铁.png" alt="" width="80%" height="80%" srcset="">
              </a>
            </div>
          </div>
        </div>
      </div>
    </section>
	
	<div class="language-selector-container" id="languageSelector">
	        <div class="language-selector">
				<div class="language-card active" data-code="chinese_simplified">
				    <span class="code">CN</span>
				    <span class="name">简体中文</span>
				</div>
	            <div class="language-card " data-code="english">
	                <span class="code" >EN</span>
	                <span class="name">English</span>
	            </div>
				<div class="language-card" data-code="russian">
				    <span class="code" >RU</span>
				    <span class="name">PyCCKиЙ</span>
				</div>
				<div class="language-card" data-code="french">
				    <span class="code">FR</span>
				    <span class="name">Frangais</span>
				</div>
	            <div class="language-card" data-code="spanish">
	                <span class="code">ES</span>
	                <span class="name">Español</span>
	            </div>
	            <div class="language-card" data-code="arabic">
	                <span class="code">AR</span>
	                <span class="name">بالعربية</span>
	            </div>
	            <img src="assets/CodeBubbyAssets/37_671/1.svg" class="close-icon" id="close-icon">
	        </div>
	    </div>

    <!-- 合作伙伴 -->
    <section class="section">
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-12 text-center">
            <div class="section-title">
              <h4 class="title text-uppercase mb-4">我们的合作伙伴</h4>
              <p class="section-description">
                以精工为基，以创新为帆，我们愿作您最坚实的臂膀。同心偕行，共克技术难关，携手打造引领时代的卓越装备，成就彼此更宏远的未来。
              </p>
            </div>
          </div>
        </div>
        <div class="row mt-4" >
          <div class="customCard">
            <div class="customCard-row">
              <a href="#" class="customIcon">
                <img src="images/customer/0.jpg" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="#" class="customIcon">
                <img src="images/customer/1.png" alt="" width="100%" height="30%" srcset="">
              </a>
              <a href="#" class="customIcon">
                <img src="images/customer/2.jpg" alt="" width="100%" height="30%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/3.png" alt="" width="80%" height="80%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/4.jpeg" alt="" width="80%" height="80%" srcset="">
              </a>
            </div>
            <div class="customCard-row" style="margin-top: 20px;">
              <a href="" class="customIcon">
                <img src="images/customer/5.jpg" alt="" width="90%" height="30%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/7.png" alt="" width="90%" height="20%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/8.gif" alt="" width="90%" height="30%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/9.jpg" alt="" width="90%" height="20%" srcset="">
              </a>
              <a href="" class="customIcon">
                <img src="images/customer/11.png" alt="" width="90%" height="90%" srcset="">
              </a>
            </div>
          </div>
        </div>
      </div>
    </section>

	<!-- 荣誉证书内容 -->
    <section class="honor-section">
        <img src="assets/CodeBubbyAssets/22_355/1.png" alt="背景" class="honor-bg">
        <div class="honor-overlay"></div>
        
        <div class="container">
            <div class="section-header">
                <h1 class="section-title" style="color: #fff;">荣誉证书</h1>
                <p class="section-description" style="color: #fff;">以精工为基，以创新为帆，我们愿作您最坚实的臂膀。同心偕行，共克技术难关，携手打造引领时代的卓越装备，成就彼此更宏远的未来。</p>
            </div>
            
            <div class="certificates-container">
                <!-- 上方大证书 -->
                <div class="top-certificates">
                    <div class="certificate-large-1">
                        <img src="assets/CodeBubbyAssets/22_355/2.png" alt="荣誉证书" class="certificate-large" data-index="0">
                    </div>
                    <div class="certificate-large-2">
                        <img src="assets/CodeBubbyAssets/22_355/3.png" alt="荣誉证书" class="certificate-large" data-index="1">
                    </div>
                    <div class="certificate-medium-1">
                        <img src="assets/CodeBubbyAssets/22_355/4.png" alt="荣誉证书" class="certificate-medium" data-index="2">
                    </div>
                    <div class="certificate-medium-2">
                        <img src="assets/CodeBubbyAssets/22_355/5.png" alt="荣誉证书" class="certificate-medium" data-index="3">
                    </div>
                </div>
                
                <!-- 下方小证书 -->
                <div class="bottom-certificates">
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/6.png" alt="荣誉证书" class="certificate-small" data-index="4">
                    </div>
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/7.png" alt="荣誉证书" class="certificate-small" data-index="5">
                    </div>
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/8.png" alt="荣誉证书" class="certificate-small" data-index="6">
                    </div>
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/9.png" alt="荣誉证书" class="certificate-small" data-index="7">
                    </div>
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/10.png" alt="荣誉证书" class="certificate-small" data-index="8">
                    </div>
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/11.png" alt="荣誉证书" class="certificate-small" data-index="9">
                    </div>
                    <div>
                        <img src="assets/CodeBubbyAssets/22_355/12.png" alt="荣誉证书" class="certificate-small" data-index="10">
                    </div>
                </div>
            </div>
        </div>
    </section>
	
	<!-- 新闻中心内容 -->
    <section class="news-section">
        <div class="container">
            <div class="section-header">
                <h1 class="section-title">新闻中心</h1>
                <p class="section-description">欢迎阅读新闻通识，我们在媒体上分享我们的专业知识。</p>
            </div>

            <!-- 新闻选项卡 -->
            <div class="news-tabs">
                <div class="news-tab active" data-tab="公司新闻">公司新闻</div>
                <div class="news-tab" data-tab="行业新闻">行业新闻</div>
                <div class="news-tab" data-tab="常见问题">常见问题</div>
            </div>

            <!-- 新闻展示网格 -->
            <div class="news-grid" >
                <!-- 左侧特色新闻 -->
                <div class="featured-news" >
                    
                </div>

                <!-- 右侧新闻列表 -->
                <div class="news-list" id="news-list">

                </div>
            </div>

            <!-- 更多新闻按钮 -->
            <a href="./pageNews/index.html" class="more-news-btn">更多新闻</a>
        </div>
    </section>
    
    <!-- 证书查看器 -->
    <div class="certificate-viewer">
        <span class="close-viewer">&times;</span>
        <span class="prev-cert"><</span>
        <img src="" alt="证书大图">
        <span class="next-cert">></span>
    </div>

    <!-- 页脚开始 -->
    <footer class="footer py-5 bg-dark" >
      <div class="container">
        <div class="row" >
          <div class="col-lg-4 col-md-12" >
            <div class="col-md-6">
                <h2 class="text-white mb-4">联系我们</h2>
                <!-- 电话卡片 -->
                <div class="contact-card">
                    <div class="contact-icon">
                        <img src="assets/CodeBubbyAssets/37_124/2.svg" alt="电话">
                    </div>
                    <div>
                        <div class="contact-title">联系电话</div>
                        <div class="contact-value">139 8210 9408（张总）</div>
                    </div>
                </div>
                
                <!-- 邮件卡片 -->
                <div class="contact-card">
                    <div class="contact-icon">
                        <img src="assets/CodeBubbyAssets/37_124/3.svg" alt="邮件">
                    </div>
                    <div>
                        <div class="contact-title">邮件</div>
                        <div class="contact-value">123@abcde.com</div>
                    </div>
                </div>
                
                <!-- 地址卡片 -->
                <div class="contact-card">
                    <div class="contact-icon">
                        <img src="assets/CodeBubbyAssets/37_124/4.svg" alt="地址">
                    </div>
                    <div>
                        <div class="contact-title">来访地址</div>
                        <div class="contact-value">中国安徽马鞍山</div>
                    </div>
                </div>
            </div>
          </div>

          <div class="col-lg-4 col-md-12" >
            <div class="col-md-6">
                <h2 class="text-white mb-4">快速入口</h2>
                <div class="quick-links">
                    <a href="./pageProduct/index.html" class="quick-link">产品中心</a>
                    <a href="./pageNews/index.html" class="quick-link">新闻中心</a>
                    <a href="./pageWhyBuyus/index.html" class="quick-link">为什么选择我们</a>
                    <!-- <a href="./pageService/index.html" class="quick-link">服务</a> -->
                    <a href="./pageContact/index.html" class="quick-link">联系我们</a>
                </div>
            </div>
          </div>

          <div class="col-lg-3 col-md-4 mt-4 pt-2 mt-lg-0 pt-lg-0" >
			<h3 class="text-white mb-4">营业时间</h3>
            <ul class="list-unstyled text-foot mt-4 mb-0">
              <li>周一至周五：9:00 至 17:00</li>
              <li class="mt-2">周六：10:00 至 15:00</li>
              <li class="mt-2">周日：休息（假日）</li>
            </ul>
          </div>
        </div>
      </div>
    </footer>
    <footer class="footer py-4 footer-bar bg-dark">
      <div class="container text-foot text-center">
        <div class="row align-items-center" >
		
			<div class="col-sm-15" >
			    <div class="text-sm-left">
			      <p class="mb-0">
			        鑫大簇数控机床有限公司2024版权所有 &nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;皖ICP备2025098111号<br> 本网站提供的所有产品信息仅供参考，具体以产品实物为准
			      </p>
			    </div>
			</div>
			
          <div class="col-sm-4 mt-4 mt-sm-0 pt-2 pt-sm-2">
            <div class="text-sm-right">
              <a href="#" class="back-to-top rounded d-inline-block text-center" id="back-to-top" >
                <i class="mdi mdi-chevron-up d-block"> </i>
              </a>
            </div>
          </div>
        </div>
      </div>
    </footer>
    <!-- 页脚结束 -->

    <!-- javascript -->

    <script src="js/jquery-3.5.1.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>
    <script src="js/jquery.easing.min.js"></script>
    <script src="js/scrollspy.min.js"></script>
    <script src="js/menu.js"></script>
    <!-- Magnific Popup -->
    <script src="js/jquery.magnific-popup.min.js"></script>
    <script src="js/isotope.js"></script>
    <script src="js/portfolio.init.js"></script>
    <script src="js/magnific.init.js"></script>
    <!-- Slider -->
    <script src="js/slick.min.js "></script>
    <!-- Contact -->
    <script src="js/contact.js"></script>
    <!-- Main Js -->
    <script src="js/app.js"></script>
    <!-- <script src="https://cdn.staticfile.net/translate.js/3.12.0/translate.js"></script> -->
    <!-- <script src="js/jquery.i18n.properties.min.js"></script> -->
    
    <!-- <script src="js/language.js"></script> -->
	
	<!-- JavaScript -->
	<script src="js/jquery-3.5.1.min.js"></script>
	<script src="js/bootstrap.bundle.min.js"></script>
	<script src="js/jquery.i18n.properties.js"></script>
	<script src="https://cdn.staticfile.net/translate.js/3.12.0/translate.js"></script>
	<script src="js/loading.js"></script>
    <script>
      // translate.language.setLocal("chinese_simplified"); //设置本地语种（当前网页的语种）。如果不设置，默认自动识别当前网页显示文字的语种。 可填写如 'english'、'chinese_simplified' 等，具体参见文档下方关于此的说明。
      // translate.service.use("client.edge"); //设置机器翻译服务通道，直接客户端本身，不依赖服务端 。相关说明参考 http://translate.zvo.cn/43086.html
      // translate.listener.start(); //开启页面元素动态监控，js改变的内容也会被翻译 http://translate.zvo.cn/4067.html
      // translate.request.listener.start(); //对ajax请求进行监控，以进行对其翻译  http://translate.zvo.cn/4086.html
      // translate.execute(); //进行翻译
	  	translate.service.use('client.edge');
	  	translate.language.setDefaultTo('chinese_simplified');
	  	translate.language.setLocal('chinese_simplified');
	  	translate.listener.start();
	  	translate.selectLanguageTag.show = false; // 隐藏默认的语言选择器
	  	    // translate.language.translateLocal = true;
	  	translate.execute();
		 
	  
	  // 页面初始化
	  document.addEventListener('DOMContentLoaded', function() {
	  	const code = localStorage.getItem('LanguageCode')
		
		if(code){
			var laguage = document.getElementById('language');
			laguage.textContent = code
		}
		
	  	
	      // 在这里编写你的初始化代码
	  });
	  
	  const baseUrl = 'https://xdcmt.com'
	  
	  // var baseuRL = window.baseuRLMap[window.excuseEnv];
	  // window.excuseEnv = "local"; 
	  // window.baseuRLMap = {
	  // 	// "local": "http://192.168.1.57:48080", 
	  // 	"local": "https://wangyang.vip.cpolar.cn",  
	  // 	"test": "https://wepay.yunshucs.cn",
	  // 	"prod": "https://ctrl.yunshucs.cn"
	  // }
	  
	  // var query = JSON.parse(data) 
	  function getProducts(id){
		  console.log(id);
		  $.ajax({
		  	  type: "post",
		      url: baseUrl + "/product/getlist",
		      dataType: "json",
		      contentType: "application/json",
		  		  data:JSON.stringify({
		          page: 1,
		          limit: 10,
		  		  title:id
		      }),
		  		  success:function(res) {
					  
					  const cards = document.querySelectorAll('.product-card');
					  cards.forEach(tab =>{
					  	tab.remove()
					  })
					  
					  let html = '';
					  let cardItems = []
					  
					  for (var i = 0; i < 4; i++) {
						if(res.data[i]){
							cardItems.push(res.data[i])
						}
					  }
					  console.log(cardItems);
					  
					  $.each(cardItems,(index,item) =>{
						  html+=`<div class="product-card">
	                        <div class="product-card-bg"></div>
	                        <img src="${item.images}" alt="电液伺服折弯机" class="product-card-image">
	                        <h3 class="product-card-title">${item.name}</h3>
	                        <div class="product-card-divider"></div>
	                    </div>`
					  })
					  
					  let fatherCards = document.getElementById('product-cards')
					  fatherCards.insertAdjacentHTML('beforeend',html)
					  
		  		  },
		  		  error: function (error) {},
		  })
		  
		  
		  
	  }
	  
	  function getTabTitle(){
	  		  $.ajax({
	  			 type:'get',
	  			 url: baseUrl + '/product/getListTitle',
	  			 dataType:'json',
	  			 contentType:'application/json',
	  			 success:function(res){
					if(res.code == 20000){
						const tabs = document.querySelectorAll('.product-tab');
						tabs.forEach(tab =>{
							tab.remove()
						})
					}
					
					let types = res.data
					let html=[]
					 
					$.each(types,(index,item) =>{
						html.push(`<div class="product-tab" data-name="${item}">${item}</div>`)
					})
					html[0] = `<div class="product-tab active" data-name="${types[0]}">${types[0]}</div>`
					
					let htmlstr = html.join(',').replace(new RegExp(',','g'),'')
					
					let dom = document.getElementById('product-tab')
					dom.insertAdjacentHTML('beforeend',htmlstr)
					
					getProducts(types[0])
					
					
					const tabs = document.querySelectorAll('.product-tab');
					const indicator = document.querySelector('.tab-indicator');
					        
					tabs.forEach((tab,index) => {
					    tab.addEventListener('click', function() {
					        // 移除所有active类
					        tabs.forEach(t => t.classList.remove('active'));
					        // 添加active类到当前选项卡
					        this.classList.add('active');
							console.log(this.getAttribute('data-name'),this);
							getProducts(this.getAttribute('data-name'))
					                
					        // 移动指示器
					        const rect = this.getBoundingClientRect();
					        const containerRect = this.parentElement.getBoundingClientRect();
					        indicator.style.left = (rect.left - containerRect.left) + 'px';
					        indicator.style.width = rect.width + 'px';
					    });
					});
					 
	  			 }
	  		  })
	  }
	  getTabTitle()
	  
	  
	  // 证书图片查看
	  document.addEventListener('DOMContentLoaded', function() {
	              // 证书图片数组
	              const certificates = [
	                  'assets/CodeBubbyAssets/22_355/2.png',
	                  'assets/CodeBubbyAssets/22_355/3.png',
	                  'assets/CodeBubbyAssets/22_355/4.png',
	                  'assets/CodeBubbyAssets/22_355/5.png',
	                  'assets/CodeBubbyAssets/22_355/6.png',
	                  'assets/CodeBubbyAssets/22_355/7.png',
	                  'assets/CodeBubbyAssets/22_355/8.png',
	                  'assets/CodeBubbyAssets/22_355/9.png',
	                  'assets/CodeBubbyAssets/22_355/10.png',
	                  'assets/CodeBubbyAssets/22_355/11.png',
	                  'assets/CodeBubbyAssets/22_355/12.png'
	              ];
	              
	              // 获取所有证书图片和查看器元素
	              const certImages = document.querySelectorAll('.certificate-large, .certificate-medium, .certificate-small');
	              const viewer = document.querySelector('.certificate-viewer');
	              const viewerImg = viewer.querySelector('img');
	              const closeBtn = document.querySelector('.close-viewer');
	              const prevBtn = document.querySelector('.prev-cert');
	              const nextBtn = document.querySelector('.next-cert');
	              
	              let currentIndex = 0;
	              
	              // 点击证书图片打开查看器
	              certImages.forEach(img => {
	                  img.addEventListener('click', function() {
	                      currentIndex = parseInt(this.dataset.index);
	                      viewerImg.src = certificates[currentIndex];
	                      viewer.style.display = 'flex';
	                  });
	              });
	              
	              // 关闭查看器
	              closeBtn.addEventListener('click', function() {
	                  viewer.style.display = 'none';
	              });
	              
	              // 查看上一张证书
	              prevBtn.addEventListener('click', function() {
	                  currentIndex = (currentIndex - 1 + certificates.length) % certificates.length;
	                  viewerImg.src = certificates[currentIndex];
	              });
	              
	              // 查看下一张证书
	              nextBtn.addEventListener('click', function() {
	                  currentIndex = (currentIndex + 1) % certificates.length;
	                  viewerImg.src = certificates[currentIndex];
	              });
	              
	              // 点击背景关闭查看器
	              viewer.addEventListener('click', function(e) {
	                  if (e.target === viewer) {
	                      viewer.style.display = 'none';
	                  }
	              });
	              
	              // 键盘导航
	              document.addEventListener('keydown', function(e) {
	                  if (viewer.style.display === 'flex') {
	                      if (e.key === 'Escape') {
	                          viewer.style.display = 'none';
	                      } else if (e.key === 'ArrowLeft') {
	                          currentIndex = (currentIndex - 1 + certificates.length) % certificates.length;
	                          viewerImg.src = certificates[currentIndex];
	                      } else if (e.key === 'ArrowRight') {
	                          currentIndex = (currentIndex + 1) % certificates.length;
	                          viewerImg.src = certificates[currentIndex];
	                      }
	                  }
	              });
	    });
		
		setTimeout(() =>{
			getNewsList('公司新闻')
		},1000)
		
		function getNewsList(str){
			$.ajax({
				type:'post',
				url:baseUrl + "/news/getlist",
				dataType:'json',
				contentType:'application/json',
				data:JSON.stringify({
					page:1,
					limit:10,
					theme:str
				}),
				success:function(res){
					if(res.code == 20000){
						
						const newsList = res.data;
						
						newsList.forEach(item =>{
							const dateObj = new Date(item.create_date);
							
							item.create_date = dateObj.toISOString().split('T')[0]
						})
						
						let html = [];
						
						$.each(newsList,(index,item) =>{
							html.push(`<div class="news-item">
							<div class="news-item-content">
								<div class="news-item-date">
									<div class="news-item-day">${item.create_date.slice(-2)}</div>
									<div class="news-item-month">${item.create_date.slice(0,-3)}</div>
								</div>
								<div class="news-item-text">
									<h3 class="news-item-title">${item.title}</h3>
									<p class="news-item-summary">${item.introduction}</p>
								</div>
							</div>
							</div>`)
						})
						
						let htmlstr = html.join(',').replace(new RegExp(',','g'),'')
						
						const newsListDom =  document.querySelector('.news-list');
						newsListDom.innerHTML = '';
						
						newsListDom.insertAdjacentHTML('beforeend',htmlstr)
						
						var gridHtml = `
							<img src="${newsList[0].file}" alt="新闻图片" class="featured-news-image"></img>
							<div class="featured-news-content">
								<h2 class="featured-news-title">${newsList[0].title}</h2>
								<div class="featured-news-meta">
									<span class="news-date">${newsList[0].introduction}</span>
									<div class="news-views">
										<span>${newsList[0].create_date}</span>
									</div>
								</div>
							</div>`
						const newsGrid = document.querySelector('.featured-news');
						newsGrid.innerHTML = '';
						newsGrid.insertAdjacentHTML('beforeend',gridHtml)
						
						// console.log(newsGrid);
					}
				},
				error:function(error){}
			})
		}
		
		// 新闻
		document.addEventListener('DOMContentLoaded', function() {
			// 选项卡切换功能
			const tabs = document.querySelectorAll('.news-tab');
			        
			tabs.forEach(tab => {
			    tab.addEventListener('click', function() {
			        // 移除所有active类
			        tabs.forEach(t => t.classList.remove('active'));
			        // 添加active类到当前选项卡
			        this.classList.add('active');
			                
			        // 这里可以添加AJAX加0载不同类别新闻的功能
			        const tabType = this.dataset.tab;
			        console.log(`加载${tabType}类别的新闻`);
					getNewsList(tabType)
			                
			        // 模拟加载效果
			        const newsGrid = document.querySelector('.news-grid');
			        newsGrid.style.opacity = '0.5';
			        setTimeout(() => {
			            newsGrid.style.opacity = '1';
			        }, 500);
			    });
			});
		});
		
		// const CurrentLangId =translate.language.getCurrent();
	  	// 语言切换
	  document.getElementById('language').addEventListener('click', function(event) {
	      event.preventDefault();
	      // 可以添加其他代码来处理点击事件，但不进行跳转
		  
		  var langua = document.getElementById('languageSelector')
		  langua.style.display = 'flex'
		  
		  window.scrollTo(0,0)  
		  
		  // setTimeout(()=>{
			 //  let tabStyle = tab.getAttribute('data-code')
			 //  // console.log(tabStyle);
			 //  const languageTabs = document.querySelectorAll('.language-card');
			 //  console.log('languageTabs::',languageTabs);
			 //  languageTabs.forEach((tab,index) => {
			 //  		languageTabs.forEach(t => t.classList.remove('active'));
				// 	let tabStyle = tab.getAttribute('data-code')
				// 	if(tabStyle == CurrentLangId){
				// 		tab.classList.add('active');
				// 	}
			 //  });
		  // },1000)
		  
	  });
	  
	  document.getElementById('close-icon').addEventListener('click', function(event){
		  var langua = document.getElementById('languageSelector')
		  langua.style.display = 'none'
	  })
	  
	  const languageTabs = document.querySelectorAll('.language-card');
	  languageTabs.forEach((tab,index) => {
		  
	      tab.addEventListener('click', function() {
	          // 移除所有active类
	          languageTabs.forEach(t => t.classList.remove('active'));
	          // 添加active类到当前选项卡
	          this.classList.add('active');
			  
			  const code = this.querySelector('.code').textContent;
			  activeLanguage(code)
			  localStorage.setItem('LanguageDataCode',this.getAttribute('data-code'))
			  translate.changeLanguage(this.getAttribute('data-code'));
			  var langua = document.getElementById('languageSelector')
			  langua.style.display = 'none'
			  
			  // const kabg = document.getElementById()
	                  
	      });
	  });
	  
	  function activeLanguage(code){
		  var laguage = document.getElementById('language');
		  laguage.textContent = code 
		  
		  localStorage.setItem('LanguageCode',code)
	  }
	  
    </script>
	
	<style>
		

    .customCard{
      width: 100%;
      height: 280px;
      /* align-items: s; */
    }

    .customCard-row{
      width: 100%;
      height: 125px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .customIcon{
      width: 19%;
      height: 125px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #FFFFFF;
      border-radius: 6px;
      transition: transform 0.3s;
      /* border: solid 1px #000; */
    }

    .customIcon:hover{
      background: #FFFFFF;
      box-shadow: 2px 4px 8px 0px rgba(207,207,207,0.6);
      transform: scale(1.05);
    }

    /* 实力见证模块样式 */
    .strength-section {
        padding: 60px 0;
        background-color: #f5f7fa;
    }

    .container {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 20px;
    }

    /* 模块标题样式 */
        .section-title {
            text-align: center;
            margin: 60px 0 40px;
            position: relative;
        }
        
        .section-title h2 {
            font-size: 36px;
            color: #1a2b47;
            display: inline-block;
            padding-bottom: 10px;
            position: relative;
        }
        
        .section-title h2::after {
            content: '';
            position: absolute;
            width: 60%;
            height: 3px;
            background-color: #4db7fe;
            bottom: 0;
            left: 20%;
        }
		
		.product-center {
		            padding: 120px 0 80px;
		            background: white;
		        }
		        
		        .section-header {
		            text-align: center;
		            margin-bottom: 60px;
		        }
		        
		        .section-title {
		            font-size: 40px;
		            font-weight: 700;
		            color: #333;
		            margin-bottom: 20px;
		            background: linear-gradient(90deg, #333, #333);
		            -webkit-background-clip: text;
		            background-clip: text;
		            color: transparent;
		        }
		        
		        .section-description {
		            color: #767B87;
		            font-size: 14px;
		            font-weight: 400;
		        }
		        
		        .product-tabs {
		            display: flex;
		            justify-content: center;
		            gap: 30px;
		            margin-bottom: 40px;
		            position: relative;
		        }
		        
		        .product-tab {
		            font-size: 24px;
		            color: #848484;
		            cursor: pointer;
		            padding: 10px 20px;
		            transition: all 0.3s ease;
		        }
		        
		        .product-tab.active {
		            color: #333;
		            font-weight: 700;
		        }
		        
		        .tab-indicator {
		            position: absolute;
		            bottom: -5px;
		            height: 5px;
					left: 115px;
		            background: linear-gradient(90deg, #0D72F6 0%, #2BB5FD 100%);
		            transition: all 0.3s ease;
		        }
		        
		        .tab-divider {
		            width: 100%;
		            height: 1px;
		            background: #B9BCC5;
		            margin-top: -36px;
		        }
		        
		        .product-grid {
		            display: grid;
		            grid-template-columns: 288px 1fr;
		            gap: 16px;
		            max-width: 1152px;
		            margin: 0 auto;
					margin-top: 36px;
		        }
		        
		        .main-product {
		            position: relative;
		            border-radius: 8px;
		            overflow: hidden;
		            height: 576px;
		        }
		        
		        .main-product-image {
		            width: 100%;
		            height: 100%;
		            object-fit: cover;
		        }
		        
		        .main-product-overlay {
		            position: absolute;
		            top: 0;
		            left: 0;
		            width: 100%;
		            height: 100%;
		            background: rgba(17, 17, 17, 0.7);
		            display: flex;
		            flex-direction: column;
		            justify-content: space-between;
		            padding: 48px 23px 58px;
		            color: white;
		        }
		        
		        .main-product-title {
		            font-size: 32px;
		            font-weight: 700;
		            margin-bottom: 20px;
		        }
		        
		        .main-product-description {
		            font-size: 18px;
		            color: #C4C4C4;
		            line-height: 1.5;
		        }
		        
		        .learn-more {
		            display: flex;
		            align-items: center;
		            gap: 8px;
		            color: white;
		            text-decoration: none;
		            font-size: 14px;
		            align-self: flex-end;
		        }
		        
		        .product-cards {
		            display: grid;
		            grid-template-columns: 1fr 1fr;
		            gap: 16px;
		        }
		        
		        .product-card {
		            background: #F6F7F8;
		            border-radius: 8px;
		            padding: 24px;
		            height: 280px;
		            position: relative;
		            overflow: hidden;
		        }
		        
		        .product-card-bg {
		            position: absolute;
		            top: 0;
		            left: 0;
		            width: 100%;
		            height: 100%;
		            background: #F3F4F6;
		            border-radius: 8px;
		            z-index: 1;
		        }
		        
		        .product-card-image {
		            position: absolute;
		            width: 391px;
		            height: 303px;
		            left: 25px;
		            top: -16px;
		            z-index: 2;
		        }
		        
		        .product-card-title {
		            position: relative;
		            z-index: 3;
		            font-size: 14px;
		            color: #313132;
		            margin-bottom: 8px;
		        }
		        
		        .product-card-divider {
		            width: 24px;
		            height: 1px;
		            background: #B9BCC5;
		            margin-bottom: 26px;
		            position: relative;
		            z-index: 3;
		        }
		        
		        @media (max-width: 1024px) {
		            .product-grid {
		                grid-template-columns: 1fr;
		            }
		            
		            .main-product {
		                height: 400px;
		            }
		            
		            .product-cards {
		                grid-template-columns: 1fr;
		            }
		        }
		        
		        @media (max-width: 768px) {
		            .product-tabs {
		                flex-wrap: wrap;
		                gap: 15px;
		            }
		            
		            .product-tab {
		                font-size: 18px;
		                padding: 8px 12px;
		            }
		            
		            .section-title {
		                font-size: 32px;
		            }
		            
		            .main-product {
		                height: 300px;
		            }
		            
		            .main-product-title {
		                font-size: 24px;
		            }
		            
		            .main-product-description {
		                font-size: 14px;
		            }
		    }
		/* 荣誉证书页面样式 */
        .honor-section {
            position: relative;
            width: 100%;
            min-height: 925px;
            overflow: hidden;
            padding: 120px 0;
        }
        
        .honor-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: -2;
        }
        
        .honor-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.7);
            z-index: -1;
        }
        
        .section-header {
            text-align: center;
            margin-bottom: 60px;
            color: white;
        }
        
        .section-title {
            font-size: 40px;
            font-weight: 700;
            margin-bottom: 20px;
        }
        
        .section-description {
            font-size: 18px;
            font-weight: 400;
            max-width: 648px;
            margin: 0 auto;
            line-height: 1.6;
        }
        
        .certificates-container {
            max-width: 1152px;
            margin: 0 auto;
        }
        
        .top-certificates {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            gap: 15px;
            margin-bottom: 20px;
        }
        
        .certificate-large-1 {
            grid-column: span 4;
        }
        
        .certificate-large-2 {
            grid-column: span 4;
        }
        
        .certificate-medium-1 {
            grid-column: span 2;
        }
        
        .certificate-medium-2 {
            grid-column: span 2;
        }
        
        .bottom-certificates {
            display: grid;
            grid-template-columns: repeat(7, 1fr);
            gap: 17px;
        }
        
        .certificate-small {
            width: 100%;
            height: 210px;
            object-fit: cover;
            transition: transform 0.3s ease;
        }
        
        .certificate-large {
            width: 100%;
            height: 252px;
            object-fit: cover;
            transition: transform 0.3s ease;
        }
        
        .certificate-medium {
            width: 100%;
            height: 253px;
            object-fit: cover;
            transition: transform 0.3s ease;
        }
        
        .certificate-small:hover,
        .certificate-large:hover,
        .certificate-medium:hover {
            transform: scale(1.05);
            cursor: pointer;
        }
        
        /* 响应式样式 */
        @media (max-width: 1200px) {
            .top-certificates {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .certificate-large-1,
            .certificate-large-2,
            .certificate-medium-1,
            .certificate-medium-2 {
                grid-column: span 1;
            }
            
            .bottom-certificates {
                grid-template-columns: repeat(4, 1fr);
                gap: 15px;
            }
        }
        
        @media (max-width: 768px) {
            .section-title {
                font-size: 32px;
            }
            
            .section-description {
                font-size: 16px;
            }
            
            .bottom-certificates {
                grid-template-columns: repeat(3, 1fr);
            }
        }
        
        @media (max-width: 576px) {
            .top-certificates {
                grid-template-columns: 1fr;
            }
            
            .bottom-certificates {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        
        /* 图片查看器 */
        .certificate-viewer {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.9);
            display: none;
            justify-content: center;
            align-items: center;
            z-index: 1000;
        }
        
        .certificate-viewer img {
            max-width: 90%;
            max-height: 90%;
            object-fit: contain;
        }
        
        .close-viewer {
            position: absolute;
            top: 20px;
            right: 20px;
            color: white;
            font-size: 30px;
            cursor: pointer;
        }
        
        .prev-cert, .next-cert {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            color: white;
            font-size: 30px;
            cursor: pointer;
            background: rgba(0, 0, 0, 0.5);
            width: 50px;
            height: 50px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        
        .prev-cert {
            left: 20px;
        }
        
        .next-cert {
            right: 20px;
        }
		
		/* 新闻中心页面样式 */
		        .news-section {
		            background: #F6F7F8;
		            padding: 120px 0 80px;
		        }
		        
		        .section-header {
		            text-align: center;
		            margin-bottom: 40px;
		        }
		        
		        .section-title {
		            font-size: 40px;
		            font-weight: 700;
		            color: #333;
		            margin-bottom: 20px;
		            background: linear-gradient(90deg, #333, #333);
		            -webkit-background-clip: text;
		            background-clip: text;
		            color: transparent;
		        }
		        
		        .section-description {
		            color: #767B87;
		            font-size: 14px;
		            font-weight: 400;
		        }
		        
		        .news-tabs {
		            display: flex;
		            justify-content: center;
		            gap: 28px;
		            margin-bottom: 40px;
		        }
		        
		        .news-tab {
		            width: 102px;
		            height: 43px;
		            display: flex;
		            align-items: center;
		            justify-content: center;
		            font-size: 18px;
		            color: #848484;
		            cursor: pointer;
		            border: 1px solid #B9BCC5;
		            transition: all 0.3s ease;
					white-space: nowrap;  /* 禁止换行 */
					overflow: hidden;     /* 隐藏溢出内容 */
					text-overflow: ellipsis; /* 显示省略号 */
		        }
		        
		        .news-tab.active {
		            background: linear-gradient(90deg, #0D72F6 0%, #2BB5FD 100%);
		            color: white;
		            border: none;
					width: 102px;
					white-space: nowrap;  /* 禁止换行 */
				    overflow: hidden;     /* 隐藏溢出内容 */
				    text-overflow: ellipsis; /* 显示省略号 */
		        }
				
				.nav-link{
					white-space: nowrap;  /* 禁止换行 */
					overflow: hidden;     /* 隐藏溢出内容 */
					text-overflow: ellipsis; /* 显示省略号 */
				}
		        
		        .news-grid {
		            display: grid;
		            grid-template-columns: 1fr 1fr;
		            gap: 21px;
		            max-width: 1157px;
		            margin: 0 auto;
		        }
		        
		        .featured-news {
		            background: white;
		            border-radius: 8px;
		            overflow: hidden;
		            height: 534px;
		            display: flex;
		            flex-direction: column;
		        }
		        
		        .featured-news-image {
		            width: 100%;
		            height: 380px;
		            object-fit: cover;
		        }
		        
		        .featured-news-content {
		            padding: 20px 24px;
		            flex-grow: 1;
		            display: flex;
		            flex-direction: column;
		        }
		        
		        .featured-news-title {
		            font-size: 18px;
		            color: #333;
		            margin-bottom: 44px;
		            line-height: 1.5;
		        }
		        
		        .featured-news-meta {
		            display: flex;
		            justify-content: space-between;
		            align-items: center;
		            margin-top: auto;
		        }
		        
		        .news-date {
		            font-size: 18px;
		            color: #848484;
					width: 80%;
					white-space: nowrap;  /* 禁止换行 */
					overflow: hidden;     /* 隐藏溢出内容 */
					text-overflow: ellipsis; /* 显示省略号 */
		        }
		        
		        .news-views {
		            display: flex;
		            align-items: center;
		            gap: 8px;
		            font-size: 12px;
		            color: #898E94;
		        }
		        
		        .news-list {
		            display: flex;
		            flex-direction: column;
		            gap: 15px;
		        }
		        
		        .news-item {
		            background: white;
		            height: 122px;
		            padding: 16px;
		        }
		        
		        .news-item-content {
		            display: flex;
		            height: 90px;
		        }
		        
		        .news-item-date {
		            width: 64px;
		            text-align: right;
		            margin-right: 27px;
		            position: relative;
		        }
		        
		        .news-item-date::after {
		            content: '';
		            position: absolute;
		            top: 0;
		            right: -13.5px;
		            width: 1px;
		            height: 82px;
		            background: #D8DCE9;
		        }
		        
		        .news-item-day {
		            font-size: 40px;
		            color: #6C6B6B;
		            line-height: 1;
		        }
		        
		        .news-item-month {
		            font-size: 16px;
		            color: #848484;
		            margin-top: 5px;
					width: 65px;
					text-align: center;
		        }
		        
		        .news-item-text {
		            flex-grow: 1;
		        }
		        
		        .news-item-title {
		            font-size: 18px;
		            color: #333;
					width: 400px;
					white-space: nowrap;  /* 禁止换行 */
					overflow: hidden;     /* 隐藏溢出内容 */
					text-overflow: ellipsis; /* 显示省略号 */
		            margin-bottom: 10px;
		        }
		        
		        .news-item-summary {
		            font-size: 18px;
		            color: #848484;
		            line-height: 1.5;
		            display: -webkit-box;
		            -webkit-line-clamp: 2;
		            -webkit-box-orient: vertical;
		            overflow: hidden;
		        }
		        
		        .more-news-btn {
		            display: block;
		            width: 117px;
		            height: 30px;
		            border: 1px solid black;
		            border-radius: 8px;
		            text-align: center;
		            line-height: 30px;
		            color: #404340;
		            font-size: 14px;
		            margin: 60px auto 0;
		            text-decoration: none;
		            transition: all 0.3s ease;
		        }
		        
		        .more-news-btn:hover {
		            background: #333;
		            color: white;
		        }
		        
		        /* 响应式样式 */
		        @media (max-width: 1024px) {
		            .news-grid {
		                grid-template-columns: 1fr;
		                gap: 30px;
		            }
		            
		            .featured-news {
		                height: auto;
		            }
		            
		            .featured-news-title {
		                margin-bottom: 20px;
		            }
		        }
		        
		        @media (max-width: 768px) {
		            .news-tabs {
		                flex-wrap: wrap;
		                gap: 15px;
		            }
		            
		            .section-title {
		                font-size: 32px;
		            }
		            
		            .featured-news-image {
		                height: 250px;
		            }
		        }
		        
		        @media (max-width: 586px) {
		            .news-item-content {
		                flex-direction: column;
		                height: auto;
		            }
		            
		            .news-item {
		                height: auto;
		                padding: 16px;
		            }
		            
		            .news-item-date {
		                width: 100%;
		                text-align: left;
		                margin-right: 0;
		                margin-bottom: 10px;
		                display: flex;
		                align-items: center;
		                gap: 10px;
		            }
		            
		            .news-item-date::after {
		                display: none;
		            }
		            
		            .news-item-day {
		                font-size: 24px;
		            }
		            
		            .news-item-month {
		                margin-top: 0;
		            }
		        }
		/* 联系卡片 */
        .contact-card {
            display: flex;
            align-items: center;
			width: 375px;
            gap: 10px;
            margin-bottom: 30px;
        }
		.contact-icon {
            width: 50px;
            height: 50px;
            background: #404040;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
		.contact-title {
            color: #878788;
            font-size: 18px;
            margin-bottom: 5px;
        }
		.contact-value {
            color: #CBCECE;
            font-size: 18px;
			width: 200px;
        }
		/* 快速链接 */
        .quick-links {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }
		.quick-link {
            color: #CBCECE;
            font-size: 14px;
            text-decoration: none;
        }
		/* 响应式设计 */
        @media (max-width: 768px) {
            .contact-container {
                flex-direction: column;
            }
            
            .quick-links {
                margin-top: 30px;
            }
        }
		.language-switch {
            display: flex;
            align-items: center;
            gap: 8px;
        }
		
		/* .changeSwipe{
			position: absolute;
			background: #2BB5FD;
		} */
		
		.language-selector-container {
		    display: none;
		    justify-content: center;
		    align-items: center;
		    width: 100%;
		    height: 100%;
		    background-color: #D9D9D9;
			position: absolute;
			left: 0;
			top: 0;
			z-index: 999;
		}
		
		.language-selector {
		    position: relative;
			background: white;
		    width: 1122px;
		    height: 376px;
		    border-radius: 8px;
		    padding: 20px;
		    /* box-sizing: border-box; */
		}
		
		.language-card {
		    position: absolute;
		    width: 301px;
		    height: 50px;
		    background: #F6F7F8;
		    border-radius: 8px;
		    display: flex;
		    justify-content: space-between;
		    align-items: center;
		    padding: 0 16px;
		    box-sizing: border-box;
		}
		
		.language-card.active {
		    background: #212121;
		}
		
		.language-card .code {
		    font-size: 14px;
		    font-family: "Microsoft YaHei", sans-serif;
		    font-weight: 400;
		    color: #333333;
		}
		
		.language-card.active .code {
		    color: white;
		}
		
		.language-card .name {
		    font-size: 14px;
		    font-family: "Microsoft YaHei", sans-serif;
		    font-weight: 400;
		    color: #333333;
		}
		
		.language-card.active .name {
		    color: white;
		}
		
		.close-icon {
		    position: absolute;
		    right: 20px;
		    top: 20px;
		    cursor: pointer;
		}
		
		/* 第一列 */
		.language-card:nth-child(1) {
		    left: 94px;
		    top: 91px;
		}
		
		.language-card:nth-child(2) {
		    left: 94px;
		    top: 153px;
		}
		
		.language-card:nth-child(3) {
		    left: 94px;
		    top: 215px;
		}
		
		.language-card:nth-child(4) {
		    left: 94px;
		    top: 277px;
		}
		
		/* 第二列 */
		.language-card:nth-child(5) {
		    left: 411px;
		    top: 91px;
		}
		
		.language-card:nth-child(6) {
		    left: 411px;
		    top: 153px;
		}
		
		.language-card:nth-child(7) {
		    left: 411px;
		    top: 215px;
		}
		
		/* 第三列 */
		.language-card:nth-child(8) {
		    left: 728px;
		    top: 91px;
		}
		
		.language-card:nth-child(9) {
		    left: 728px;
		    top: 153px;
		}
		
		.language-card:nth-child(10) {
		    left: 728px;
		    top: 215px;
		}
		

	</style>
	
  </body>
</html>